import { createRouter, createWebHashHistory } from "vue-router";
import HomeView from "../views/HomeView.vue";
import { hasPermission } from "@/utils/permission";
const routes = [
  {
    path: "/view",
    name: "view",
    component: () => import("../components/viewContainer.vue"),
    children: [
      {
        path: "/",
        name: "用户管理",
        component: HomeView,
        meta: { requiresAuth: true },
      },
      {
        path: "/about",
        name: "首页",
        // route level code-splitting
        // this generates a separate chunk (about.[hash].js) for this route
        // which is lazy-loaded when the route is visited.
        component: () =>
          import(/* webpackChunkName: "about" */ "../views/AboutView.vue"),
      },
      {
        path:'/avue',
        name:'avue',
        component:()=>import('../views/AvueView.vue')
      },
        {
        path:'/tab',
        name:'tab',
        component:()=>import('../views/TabView.vue')
      },
      {
        path:'/hide',
        name:'hide',
        component:()=>import('../views/HideView.vue')
      },{
        path:'/card',
        name:'card',
        component:()=>import('../views/CardView.vue')
      },{
        path:'/trapezoid',
        name:'trapezoid',
        component:()=>import('../views/TrapezoidView.vue')
      },{
        path:'/map',
        name:'地图',
        component:()=>import('../views/MapView.vue')
      },{
        path:'/slot',
        name:'插槽',
        component:()=>import('../views/AvueslotButton.vue')
      }
      ,{
        path:'/color',
        name:'颜色选择',
        component:()=>import('../views/ColorButton.vue')
      },
      {
        path:"/table",
        name:'表格',
        component:()=>import('../views/TableView.vue')
      },
      {
        path:"/ecahrt",
        name:'自定义图表',
        component:()=>import('../views/EchartsView.vue')
      },
      {
        path:"/H5",
        name:'h5表格组件',
        component:()=>import('../views/H5Table.vue')
      }
    ],
  },
  {
    path: "/login",
    name: "登录",
    component: () => import("../views/LoginView.vue"),
  },
];

const router = createRouter({
  history: createWebHashHistory(),
  routes,
});
router.beforeEach((to, from, next) => {
  console.log(to);
  if (to.matched.some((record) => record.meta.requiresAuth)) {
    if (hasPermission()) {
      next();
    } else {
      next("/about");
    }
  } else {
    next();
  }
});
export default router;
